<!DOCTYPE html>
<html>

<head>
    {include file="common/meta" /}
    <style type="text/css">
        body {
            color: #999;
            background: #fff url(https://img.huajuanyun.com/202102/20210910173958.png);
            font-family: PingFangSC-Regular, Tahoma, Microsoft Yahei, sans-serif !important;
        }

        a {
            color: #fff;
        }

        .login-panel {
            margin-top: 150px;
        }

        .login-screen {
            max-width: 450px;
            padding: 0;
            margin: 200px auto 0 auto;

        }

        .login-screen .well {
            border-radius: 6px;
            background: #fff;
            border: none !important;
            padding: 40px 0px 25px;
            box-shadow: 0 3px 20px 0 rgb(51 43 43 / 12%);
        }

        .login-screen .copyright {
            text-align: center;
            position: absolute;
            bottom: 15px;
            width: 450px;
        }

        @media(max-width:767px) {
            .login-screen {
                padding: 0 20px;
            }
        }

        /*三星S5*/
        /*iPhone se*/
        @media screen and (max-width: 380px) {
            .btn-captcha {
                width: 76px !important;
            }

            #pd-form-verify {
                width: 61% !important;
            }
        }

        .profile-img-card {
            width: 64px;
            height: 64px;
            margin: 15px auto 30px;
            display: block;
            -moz-border-radius: 50%;
            -webkit-border-radius: 50%;
            border-radius: 100%;
        }

        .profile-name-card {
            text-align: center;
        }

        #login-form {
            margin-top: 20px;
        }

        #login-form .input-group {
            margin-bottom: 22px;
        }

        .third-icon {
            background-size: contain;
            background-position: 0 0;
            width: 22px;
            height: 22px;
            display: inline-block;
            background-repeat: no-repeat;
            vertical-align: bottom;
        }

        #thirdpart-login .icon-verify {
            background-image: url(https://waquan-statics.dhcc.wang/oss/uploads/backend/201906/0_d415b062a1d7381b80823808f25b9e4c.png);
        }

        #thirdpart-login .icon-password {
            background-image: url(https://waquan-statics.dhcc.wang/oss/uploads/backend/201906/0_333df4651b3a9a58aa71aa0c5a501d8c.png);
        }

        .input-group {
            width: 90%;
            margin: 0 auto;
            margin-bottom: 20px;
        }

        .form-control {
            border-radius: 5px !important;
        }

        .btn-captcha {
            padding: 9px;
            width: 80px;
        }

        .qrcode img {
            padding: 15px;
            /*border: 1px solid #f3f3f3;*/
            /*box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);*/
        }

        .login-type {
            text-align: center;
            margin-top: 20px;
        }

        .login-type span {
            display: block;
            margin: 20px 0 10px
        }

        .login-area {
            cursor: pointer;
            color: #444;
        }

        #pd-form-verify {
            width: 67%;
        }

        .m-l-10 {
            margin-left: 10px;
        }

        #embed-captcha {
            padding: 0 50px;
        }

        .not-select {
            -moz-user-select: none;
            /*火狐*/
            -webkit-user-select: none;
            /*webkit浏览器*/
            -ms-user-select: none;
            /*IE10*/
            -khtml-user-select: none;
            /*早期浏览器*/
            user-select: none;
        }

        #sysInfo {
            font-size: 28px;
            color: #222;
            margin-bottom: 30px;
            text-align: center;
            display: none
        }
    </style>
    <!--@formatter:off-->
    {if $background}
    <style type="text/css">
        body {
            background-image: url('{$background}');
        }
    </style>
    {/if}
    <!--@formatter:on-->
</head>

<body>
    <div class="container">
        <div class="login-wrapper">
            <div class="login-screen">
                <div class="well">

                    <div class="login-form form-horizontal">
                        <img id="profile-img" class="profile-img-card"
                            src="http://cdn.8n888.cn/uploads/20231107/856947342dfb71db97f024a5ca2c430d.png" />
                        <p id="profile-name" class="profile-name-card"></p>

                        <form action="" method="post" id="login-form">
                            <!--@AdminLoginFormBegin-->
                            <div id="errtips" class="hide"></div>
                            {:token()}
                            <div class="input-group">
                                <label for="pd-form-username" class="col-sm-3 control-label user-label">登录账号</label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control" id="pd-form-username"
                                        placeholder="{:__('Username')}" name="username" autocomplete="off" value=""
                                        data-rule="{:__('Username')}:required;username" />
                                </div>

                            </div>

                            <div class="input-group">
                                <label for="pd-form-password" class="col-sm-3 control-label">登录密码</label>
                                <div class="col-sm-9">
                                    <input type="password" class="form-control" id="pd-form-password"
                                        placeholder="{:__('Password')}" name="password" autocomplete="off" value=""
                                        data-rule="{:__('Password')}:required;password" />
                                </div>

                            </div>
                            <!--@CaptchaBegin-->
                            {if $Think.config.fastadmin.login_captcha}
                            <div class="input-group">
                                <div class="input-group-addon"><span class="glyphicon glyphicon-option-horizontal"
                                        aria-hidden="true"></span></div>
                                <input type="text" name="captcha" class="form-control" placeholder="{:__('Captcha')}"
                                    data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length})"
                                    autocomplete="off" />
                                <span class="input-group-addon" style="padding:0;border:none;cursor:pointer;">
                                    <img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" width="100" height="30"
                                        onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();" />
                                </span>
                            </div>
                            {/if}

                            <div class="input-group hidden">
                                <label for="pd-form-verify" class="col-sm-3 control-label">验证码</label>
                                <div class="col-sm-9">
                                    <input type="tel" class="form-control" id="pd-form-verify" placeholder="请输入验证码"
                                        name="code" autocomplete="off" value="" data-rule="code" />
                                    <span class="m-l-10" style="padding:0;border:none;">
                                        <a href="javascript:;" class="btn btn-default btn-captcha"
                                            data-url="index/sendsms" data-type="username"
                                            data-event="adminlogin">发送验证码</a>
                                    </span>
                                </div>
                            </div>
                            <input type="hidden" name="login_type" value="username">
                            <div class="input-group" style="margin-top: 25px;padding: 0px 15px;">
                                <button type="submit" class="btn btn-primary btn-lg btn-block">登 录</button>
                            </div>


                            <div class="input-group login-type not-select" id="thirdpart-login">
                                <span>其他登录方式</span>
                                <div class="login-area verify-div " title="点我使用验证码登录">
                                    <a class="third-icon icon-verify" href="javascript:;"></a>
                                    <b>验证码登录</b>
                                </div>
                                <div class="login-area password-div hide" title="点我使用密码登录">
                                    <a class="third-icon icon-password" href="javascript:;"></a>
                                    <b>密码登录</b>
                                </div>
                            </div>
                            <!--@AdminLoginFormEnd-->
                        </form>
                    </div>


                </div>
                <p class="copyright">Copyright © 2018-2024 8nit.cn All Rights Reserved</p>
            </div>
        </div>
    </div>
    {include file="common/script" /}
</body>

</html>